<template>
  <div>
    <my-table :list="list">
      <template #title>
        <h2>品牌管理</h2>
      </template>
      <template #tableheader>
      </template>
      <template v-slot:index="{index}">
        <h3>{{index}}</h3>
      </template>
      <template v-slot:goodsname={goodname}>
        <h3>{{goodname}}</h3>
      </template>
      <template v-slot:goodsprice={goodprice}>
        <h3>{{goodprice}}</h3>
      </template>
      <template v-slot:goodstime={goodtime}>
        {{goodtime | formatTime('yyyy-MM-dd')}}
      </template>
      <template #goodsbtn>
      </template>
      <template #tablefoot>
      </template>
    </my-table>
  </div>
</template>

<script>
import MyTable from './components/MyTable.vue'
export default {
  components: { MyTable },
  data () {
    return {
      list: [
        { id: 100, name: '外套', price: 199, time: new Date('2010-08-12') },
        { id: 101, name: '裤子', price: 34, time: new Date('2013-09-01') },
        { id: 102, name: '鞋', price: 25.4, time: new Date('2018-11-22') },
        { id: 103, name: '头发', price: 19900, time: new Date('2020-12-12') }
      ]
    }
  },

  created () {

  },

  filters: {
    formatTime (curTime, type) {
      var nd = new Date(curTime)
      var y = nd.getFullYear()
      var mm = nd.getMonth() + 1
      var d = nd.getDate()
      if (mm < 10) {
        mm = '0' + mm
      }
      if (d < 10) {
        d = '0' + d
      }
      if (type === 'MM-DD') {
        return mm + '-' + d
      } else if (type === 'yyyy-MM-dd') {
        return y + '-' + mm + '-' + d
      } else if (type === 'MM-DD') {
        return mm + '-' + d + ' '
      } else if (type === '年月日') {
        return y + '年' + mm + '月' + d + '日　'
      }
      return y + '-' + mm + '-' + d
    }
  }
}
</script>

<style scoped lang='less'>

</style>
